<template>
  <div class="result">
    <div class="header_body">
      <header-nav :leftArrow="true" titelText="检查结果处理"></header-nav>

      <div class="result-content">
        <div class="title">文书制作</div>
        <div class="wsBox">
          <div class="text" @click="viewFile(safeOpinionFileUrl)">
            <img v-if="safeOpinionFileUrl == ''" src="../../assets/images/wsNo.png" alt="" />
            <img v-else src="../../assets/images/wsYes.png" alt="" />
            <div>消防安全指导意见书</div>
          </div>
          <van-button v-if="safeOpinionFileUrl == ''" type="primary" style="height: 36px !important"
            @click="goMake('administrativeGuidance')">
            制作
          </van-button>
          <van-button v-else type="danger" plain style="height: 36px !important" @click="delWS(11)">
            删除
          </van-button>
        </div>
        <div class="submitBtn">
          <van-button plain block type="primary" class="btn-left" @click="submit(1)">
            暂存
          </van-button>
          <van-button block type="primary" class="btn-right" @click="submit(0)">
            提交
          </van-button>
        </div>
      </div>
    </div>
  </div>
</template>
<script setup>
import { showSuccessToast, showNotify, showFailToast, showConfirmDialog } from 'vant'
const { useDays, usePublic } = $globalStore
const router = useRouter()
const route = useRoute()
const id = ref(route.query.id)

const detailForm = ref({})
const safeOpinionFileUrl = ref('')

const resultForm = reactive({
  id: id.value,
})

//制作文书
const goMake = (val) => {
  router.push({
    name: val,
    query: {
      id: id.value,
    },
  })
}

//查看文件
const viewFile = async (url) => {
  if (url != '') {
    router.push({
      name: 'fileDetail',
      query: {
        url: url,
      },
    })
  }
}

const delWS = async (val) => {
  let params = {
    type: val,
    taskId: id.value,
  }
  const res = await usePublic.delDoc(params)
  if (res.code == 0) {
    showSuccessToast({ message: '删除成功' })
    getInfo()
  }
}

const getInfo = async () => {
  if (id.value != '') {
    const res = await useDays.taskInfo(id.value)
    if (res.code == 0) {
      detailForm.value = res.data
      safeOpinionFileUrl.value = res.data.fileUrl
    } else {
      showFailToast(res.message)
    }
  }
}

const submit = async (val) => {
  if (val == 0 && safeOpinionFileUrl.value == '') {
    return showNotify({ type: 'danger', message: '请制作相关文书' })
  }
  if (val == 0) {
    showConfirmDialog({
      title: '提示',
      message: '是否确定结束任务？',
    })
      .then(() => {
        process(val, resultForm)
      })
      .catch(() => {
        // on cancel
      })
  } else {
    process(val, resultForm)
  }
}

const process = async (val, resultForm) => {
  const res = await useDays.process(val, resultForm)
  if (res.code == 0) {
    router.push({ name: 'daysList' })
  } else {
    showFailToast(res.message)
  }
}

onMounted(async () => {
  getInfo()
})
</script>
<style lang="scss" scoped>
.result {
  width: 100%;
  height: 100%;
  overflow-y: hidden;

  .result-content {
    width: 100%;
    height: 100%;
    margin-top: 46px;

    .title {
      padding: 16px;
      font-size: 16px;
      font-weight: 500;
      letter-spacing: 0px;
      line-height: 24px;
      color: #2b2b2b;
      border-bottom: 1px solid #f0f0f0;
    }

    .wsBox {
      padding: 16px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      border-bottom: 1px solid #f5f5f5;

      .text {
        display: flex;
        align-items: center;

        >img {
          width: 36px;
          height: 36px;
          margin-right: 12px;
        }

        >div {
          font-size: 15px;
          font-weight: 500;
          letter-spacing: 0px;
          line-height: 22px;
          color: #2b2b2b;
        }
      }
    }

    .pdBox {
      padding: 16px;
      border-bottom: 1px solid #f5f5f5;

      .pdBox-title {
        margin-bottom: 16px;
        font-size: 16px;
        font-weight: 400;
        letter-spacing: 0px;
        line-height: 24px;
        color: #4d4d4d;
      }
    }
  }
}

.line10 {
  width: 100%;
  height: 10px;
  background-color: #f7f7f7;
}
</style>
